<!-- Copyright (c) 2019-2020 十三 all rights reserved. -->
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="mall/header::head-fragment('NewBee商城-我的优惠券列表','my-coupons')">
</head>
<body>
<header th:replace="mall/header::header-fragment"></header>
<!-- nav -->
<nav th:replace="mall/header::nav-fragment"></nav>

<!-- personal -->
<div id="personal">
    <div class="self-info center">

        <!-- sidebar -->
        <div th:replace="mall/personal-sidebar::sidebar-fragment"></div>

        <div class="intro fr">
            <div class="uc-box uc-main-box">
                <div class="uc-content-box coupon-list-box">
                    <div class="box-hd">
                        <h1 class="title">我的优惠券
                            <small>请谨防钓鱼链接或诈骗电话，<a href="##">了解更多&gt;</a>
                            </small>
                        </h1>
                    </div>
                    <div class="box-bd">
                        <div class="quan-list">
                            <th:block th:if="${#lists.isEmpty(myCoupons)}">
                                <img style="margin-top: 16px;"
                                     th:src="@{/mall/image/null-content.png}">
                            </th:block>
                            <th:block th:unless="${#lists.isEmpty(myCoupons)}">

                                <th:block th:each="coupon : ${myCoupons}">
                                    <div class="quan-item quan-d-item">
                                        <div class="q-type">
                                            <div class="q-price q-price-active">
                                                <em>￥</em>
                                                <strong class="num" th:text="${coupon.discount}">360</strong>
                                                <div class="txt">
                                                    <div class="typ-txt" th:text="${coupon.couponName} + ${coupon.used?' 已使用':' 未使用'}">
                                                        newbee券
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="limit">
                                            <span class="t-span" th:text="'满' + ${coupon.min} + '元可用'">
                                                满1000元可用
                                            </span>
                                            </div>
                                            <div class="q-range">
                                                <div class="range-item">
                                                    <th:block th:if="${coupon.goodsType == 0}">全平台可用</th:block>
                                                    <th:block th:if="${coupon.goodsType == 1}">指定分类可用</th:block>
                                                    <th:block th:if="${coupon.goodsType == 2}">指定商品可用</th:block>
                                                </div>
                                                <div class="range-item" coupon-time="753151009"
                                                     th:text="${coupon.couponStartTime} + ' ' + ${coupon.couponStartTime}">
                                                    2021.01.15-2021.01.18
                                                </div>
                                            </div>
                                        </div>
                                        <div class="q-lable q-active">
                                            <a href="##" class="op-del"
                                               th:onclick="'deleteCoupon(' + ${coupon.couponUserId} +')'">X</a>
                                            <b class="semi-circle"></b>
                                        </div>
                                    </div>
                                </th:block>
                            </th:block>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="clear"></div>
</div>
</div>

<div th:replace="mall/footer::footer-fragment"></div>

<!-- jQuery -->
<script th:src="@{/admin/plugins/jquery/jquery.min.js}"></script>
<!-- sweetalert -->
<script th:src="@{/admin/plugins/sweetalert/sweetalert.min.js}"></script>
<script th:src="@{/mall/js/search.js}" type="text/javascript"></script>
<script>
    function deleteCoupon(couponUserId) {
        swal({
            title: "确认弹框",
            text: "确认要删除该优惠卷吗?",
            icon: "warning",
            buttons: true,
            dangerMode: true,
        }).then((flag) => {
                if (flag) {
                    $.ajax({
                        type: "DELETE",
                        url: "coupon/" + couponUserId,
                        contentType: "application/json",
                        success: function (r) {
                            if (r.resultCode == 200) {
                                location.reload();
                            } else {
                                swal(r.message, {
                                    icon: "error",
                                });
                            }
                        }
                    });
                }
            }
        )
    }
</script>
</body>
</html>
